{% extends 'index.html' %}
{% block content %}
    <div class="breadcrumbs">
        <div class="breadcrumbs-inner">
            <div class="row m-0">
                <div class="col-sm-4">
                    <div class="page-header float-left">
                        <div class="page-title">
                            <h1>京乳时鲜 &emsp;&emsp;&emsp;车辆管理系统&emsp;&emsp;</h1>
                        </div>
                    </div>
                </div>
                <div class="col-sm-8">
                    <div class="page-header float-right">
                        <div class="page-title">
                            <ol class="breadcrumb text-right">
                                <li><a href="{% url 'index' %}">主页</a></li>
                                <li class="active">车辆资产管理</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <h4>车辆资产管理</h4>
                    </div>
                    <div class="card-body">
                        <ul class="nav nav-pills mb-3" id="truck_asset-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="pills-total-tab" data-toggle="pill" href="#pills-total" role="tab" aria-controls="pills-total" aria-selected="true">可用车辆汇总信息</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="pills-seg1-tab" data-toggle="pill" href="#pills-seg1" role="tab" aria-controls="pills-seg" aria-selected="false">维修车辆处理</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="pills-seg2-tab" data-toggle="pill" href="#pills-seg2" role="tab" aria-controls="pills-seg" aria-selected="false">报废车辆处理</a>
                            </li>
                        </ul>
                        <div class="tab-content" id="truck_asset-tabContent">
                            <div class="tab-pane fade show active col" id="pills-total" role="tabpanel" aria-labelledby="pills-total-tab" >
                                {% if count > 0 %}
                                <div class="row1"><a href="{% url 'truck_demands' %}" class="btn btn-danger" style="margin-bottom: 10px">生成需求单</a></div>
                                {% endif %}
                                <div class="row2">
                                    <table id="bootstrap-data-table" class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>车辆型号</th>
                                                <th>数量</th>
                                                <th>统计时间</th>
                                                <th>是否充足</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <!-- /.todo-list -->
                                            {% for item in asset_info %}
                                                <tr>
                                                    <td>{{item.truck_pattern}}</td>
                                                    <td>{{item.truck_num}}</td>
                                                    <td>{{item.statistics_time|date:"Y-m-d H:i:s"}}</td>
                                                    {% if item.truck_num < 35 %}
                                                        <td><a class="btn btn-warning" style="height:50%">数量不足</a></td>
                                                    {% else %}
                                                        <td><a class="btn btn-success" style="height:50%;color: white">数量充足</a></td>
                                                    {% endif %}
                                                </tr>
                                            {% endfor %}
                                        </tbody>

                                    </table>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="pills-seg1" role="tabpanel" aria-labelledby="pills-seg1-tab">
                                    <table id="bootstrap-data-table2" class="table table-striped table-bordered" style="white-space: nowrap">
                                        <thead>
                                            <tr>
                                                <th>车辆ID</th>
                                                <th>车辆型号</th>
                                                <th>维修状态</th>
                                                <th>维修处理</th>
                                            </tr>
                                        </thead>
                                        <tbody>

                                        {% for item in service_truck_info %}
                                            <tr>
                                                <td>{{ item.truck_id }}</td>
                                                <td>{{ item.truck_pattern }}</td>
                                                <td>{{ item.service_status }}</td>
                                                <td><a href="{% url 'service_process' item.truck_id %} " class="btn btn-primary" style="height:50%">处理维修</a></td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>

                                    </table>
                            </div>
                            <div class="tab-pane fade" id="pills-seg2" role="tabpanel" aria-labelledby="pills-seg2-tab">
                                    <table id="bootstrap-data-table3" class="table table-striped table-bordered" style="white-space: nowrap">
                                        <thead>
                                            <tr>
                                                <th>车辆ID</th>
                                                <th>车辆型号</th>
                                                <th>报废处理</th>
                                            </tr>
                                        </thead>
                                        <tbody>

                                        {% for item in scrapped_truck_info %}
                                            <tr>
                                                <td>{{ item.truck_id }}</td>
                                                <td>{{ item.truck_pattern }}</td>
                                                <td><a href="{% url 'scrappe_pro' item.truck_id%}" class="btn btn-primary" style="height:50%">处理报废</a></td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>

                                    </table>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block css_js_2 %}


    <link rel="stylesheet" href="/static/assets/css/lib/datatable/dataTables.bootstrap4.min.css">
{#    <script src="/static/assets/js/lib/data-table/jquery.dataTables1.10.18.min.js"></script>#}
    <script src="/static/assets/js/popper.min.js"></script>
    <script src="/static/assets/js/bootstrap.min.js"></script>
    <script src="/static/assets/js/jquery.matchHeight.min.js"></script>
    <script src="/static/assets/js/main.js"></script>


    <script src="/static/assets/js/lib/data-table/datatables1.10.18.min.js"></script>
    <script src="/static/assets/js/lib/data-table/dataTables.bootstrap4.min.js"></script>

    <script>
        jQuery(document).ready(function($) {
            $("#trucks").addClass("active");
            $("#truck_asset_manange").addClass("active");
            $("#trucks_toggle").trigger("click");
            $('#bootstrap-data-table').DataTable( {
                aLengthMenu: [
                    [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                ],
                language:{
                    "info": "显示_START_至_END_项结果，共_TOTAL_项",
                    "search": "搜索:",
                    "paginate": {"previous": "上一页", "next": "下一页"},
                    "lengthMenu": "显示 _MENU_ 项",
                    "zeroRecords": "抱歉，没有找到符合条件的记录",
                    "infoFiltered": "(筛选自 _MAX_ 条总记录)",
                    "infoEmpty":"显示 0 至 0 项结果，共 0 项",
                },
            } );

            $('#bootstrap-data-table2').dataTable( {
                aLengthMenu: [
                    [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                ],
                language:{
                    "info": "显示_START_至_END_项结果，共_TOTAL_项",
                    "search": "搜索:",
                    "paginate": {"previous": "上一页", "next": "下一页"},
                    "lengthMenu": "显示 _MENU_ 项",
                    "zeroRecords": "抱歉，没有找到符合条件的记录",
                    "infoFiltered": "(筛选自 _MAX_ 条总记录)",
                    "infoEmpty":"显示 0 至 0 项结果，共 0 项",
                },

            } );

            $('#bootstrap-data-table3').dataTable( {
                aLengthMenu: [
                    [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                ],
                language:{
                    "info": "显示_START_至_END_项结果，共_TOTAL_项",
                    "search": "搜索:",
                    "paginate": {"previous": "上一页", "next": "下一页"},
                    "lengthMenu": "显示 _MENU_ 项",
                    "zeroRecords": "抱歉，没有找到符合条件的记录",
                    "infoFiltered": "(筛选自 _MAX_ 条总记录)",
                    "infoEmpty":"显示 0 至 0 项结果，共 0 项",
                },

            } );

        } );
    </script>
{% endblock %}